<template>
  <a-modal
    v-model:visible="modalVisible"
    :title="isAudit == 0 ? '查看渠道预约单' : '渠道预约单审核'"
    width="80%"
    :footer="null"
    @cancel="cancle"
    class="user-modal"
  >
    <slot>
      <a-form :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-card title="服务信息">
          <!-- <pre>
          {{ report.organOrderJson }}

          </pre> -->
          <block>
            <a-descriptions bordered :column="{ xxl: 2, xl: 2, lg: 2, md: 1, sm: 1, xs: 1 }">
              <a-descriptions-item label="服务对象">{{ report.name }}</a-descriptions-item>
              <a-descriptions-item label="联系电话">{{ report.mobile }}</a-descriptions-item>

              <a-descriptions-item label="服务项目">{{ report.serviceName }}</a-descriptions-item>
              <a-descriptions-item label="服务地址">{{ report.address }}</a-descriptions-item>
              <a-descriptions-item label="服务护士">{{ report.nurseName }}</a-descriptions-item>
              <a-descriptions-item label="服务时间">{{ report.scheduleTime }}</a-descriptions-item>
              <template v-for="item in report.organOrderJson">
                <a-descriptions-item v-if="item.id > 5" :label="item.fieldName">{{ item.value }}</a-descriptions-item>
                <a-descriptions-item                 
                v-if="item.fieldEnglish == 'isMail' && item.value == '是'"
                label="邮寄地址">{{ report.mailAddress }}</a-descriptions-item>
                
              </template>
              
            </a-descriptions>
            <a-divider></a-divider>
          </block>
        </a-card>

        <!-- 审核护理报告:未通过 -->
        <!-- <a-card title="拒绝原因" v-if="nursingRecord.reasonForRejection">{{ nursingRecord.reasonForRejection }}</a-card> -->
        <a-card title="审核信息">
          <div>审核人员：{{ report.auditPerson }}</div>
          <div>审核时间：{{ report.auditTime }}</div>
          <div v-if="report.cancelCase">拒绝理由：{{ report.cancelCase }}</div>
        </a-card>
      </a-form>
      <!-- 底部内容 -->
      <a-row v-if="isShowClose">
        <a-col :span="12" :offset="12">
          <a-button type="info" @click="cancle">关闭</a-button>
        </a-col>
      </a-row>
    </slot>

    <!-- 审核护理报告插槽 -->
    <div>
      <slot name="audit"> </slot>
    </div>
  </a-modal>
</template>
<script>
import { onMounted, reactive, ref, toRefs, computed } from 'vue'
import { selectOrderDetailOrganByNumber } from '@/api/buisness/index'
import { selectAdminConfigurationByServiceId } from '@/api/order/index'
export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    number: {
      default: null
    },

    // 是否审核护理报告
    isAudit: {
      type: Number,
      default: null
    },
    isShowClose: {
      type: Boolean,
      default: true
    }
  },
  setup(props, { emit, attrs }) {
    console.log('11111')

    // const visible = ref(false)
    const modalVisible = computed({
      get: () => props.visible,
      set: val => {
        emit('update:visible', val)
      }
    })

    console.log(modalVisible, '护理报告')
    // 取消，右上角这个关闭也要调用这个方法
    const cancle = () => {
      emit('closeModal')
    }
    console.log('33333333')
    const report = ref({})

    init()

    async function init() {
      let form = {
        number: props.number
      }
      let res = await selectOrderDetailOrganByNumber(form)
      if (res.success) {
        res.object.organOrderJson = JSON.parse(res.object.organOrderJson)          
        report.value = res.object
        
        // selectAdminConfigurationByServiceId({
        //   serviceId: res.object.serviceId
        // }).then(r => {
        //   data.arr = r.object
        //   initData()
        // })
        let obj = res.object.nursingRecord
        obj.staPictureUrl = obj.staPictureUrl.split(',')
        nursingRecord.value = res.object.nursingRecord
      }
    }

    onMounted(() => {})
    return {
      modalVisible,
      labelCol: {
        style: {
          width: '100px',
          fontWeight: 'bolder'
        }
      },
      wrapperCol: {
        span: 20,
        offset: 1
      },
      cancle,
      report
    }
  }
}
</script>
<style scoped>
.ant-form-item {
  margin-bottom: 10px;
}
</style>
